import React, { Component } from 'react';
import Denglu from './Denglu';
import './Zhuce.scss'
class Zhuce extends Component {
    constructor(props) {
        super(props)
        this.state = {
          
        }
    }
    changeValue = (e) => {
        this.setState({
            [e.target.name]: e.target.value
        })
    }
   
    Confirm = (e) => {
        console.log(1111);

        e.preventDefault();
        const params = new URLSearchParams();
        params.append('account', this.state.account);
        params.append('nickname', this.state.nickname);
        params.append('adminPwd', this.state.adminPwd);
        params.append('tel', this.state.tel);

        React.axios.post(`/store-manage/w2003/admin_sign-up.php`, params).then(res => {
            // 如果包含登录成功的文本，则跳转到管理首页
            if (res.data.includes("管理员账号注册成功")) {
                
                // 提示服务器返回信息
                alert(res.data);
                // 请求获取用户名的接口
                React.axios.get(`/store-manage/w2003/admin_nickname.php?account=${this.state.account}`).then(res => {
                    // 通过会话存储设置昵称
                    sessionStorage.setItem('nickname', res.data);
                    // 执行跳转到管理首页的方法
                    this.props.ol()
                });


            }
            // 提示服务器返回的错误
            else {
                alert(res.data);
                console.log(123);
            }
        })
    }
        

    render() {
        return (
            <div className="bigbox">
            <div className='box'>
                <h2>管理员注册</h2>
                <form>
                    账&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号：<input name="account" onChange={this.changeValue} type="text" placeholder="请输入账号" />
                    <br />
                昵&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;称：<input name="nickname" type="text" placeholder="请输入昵称" />
                    <br />
                手&nbsp;&nbsp;机&nbsp;&nbsp;号：<input name='tel' type="text" onChange={this.changeValue} placeholder="请输入手机号" />
                    <br />
                密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码：<input type="password" name='adminPwd' onChange={this.changeValue} placeholder="请输入密码" />
                    <br />
                确认密码：<input type="password" name='reAdminPwd' onChange={this.changeValue} placeholder="请再次输入密码" /><br></br>
                <button onClick={this.Confirm} className="zhuce">确认注册</button>
                    <p>已经拥有账号？前往 <a className="text" onClick={() => this.login()}>登录</a> 页面</p>
                   
                </form>
            </div>
        </div>
        );
    }
}

export default Zhuce;
